<h:panelGroup layout="block"
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:a4j="http://richfaces.org/a4j"
  xmlns:nxu="http://nuxeo.org/nxweb/util"
  xmlns:nxd="http://nuxeo.org/nxweb/document"
  xmlns:c="http://java.sun.com/jstl/core">

   <a4j:outputPanel id="connectAppListing" layout="block">

    <div class="actionBar marketplace">
      <span class="marketplaceLogo"><a target="_blank" href="#{nuxeoConnectUrl}marketplace"><img src="#{contextPath}/img/nuxeo_marketplace_logo.png" alt="Nuxeo Marketplace" /></a></span>
      <span><a class="connectLink" target="_blank" href="#{nuxeoConnectUrl}marketplace"><h:outputText value="#{messages['label.tab.applisting.marketplace']}"/></a></span>
    </div>
    <div class="actionBar">
      <h:form rendered="false">
        <h:outputText value="#{messages['label.packagetype']}" />
        <h:selectOneListbox class="dataInputText" size="1"
          value="#{appsViews.packageTypeFilter}">
          <f:ajax execute="@this" render="connectAppListing" event="change" />
          <nxu:selectItems value="#{appsViews.packageTypes}" var="itype"
            itemValue="#{itype.value}" itemLabel="#{messages[itype.label]}" />
        </h:selectOneListbox>
      </h:form>
      <h:form>
        <h:selectBooleanCheckbox class="dataInputText"
          value="#{appsViews.onlyRemote}"
          id="showNewPackages">
          <f:ajax execute="@this" render="connectAppListing" event="change" />
        </h:selectBooleanCheckbox>
        <h:outputLabel for="showNewPackages" value="#{messages['label.appcenter.hide.local.packages']}" />
      </h:form>
      <h:form>
        <h:selectBooleanCheckbox class="dataInputText"
          value="#{appsViews.platformFilter}"
          id="platformFilter">
          <f:ajax execute="@this" render="connectAppListing" event="change" />
        </h:selectBooleanCheckbox>
        <h:outputLabel for="platformFilter" value="#{messages['label.appcenter.platform.filter']}" />
      </h:form>
      <h:form>
        <a4j:commandButton value="#{messages['admCommand.refresh']}"
          actionListener="#{appsViews.flushCache()}"
          render="connectAppListing" styleClass="button" />
      </h:form>
    </div>

    <h:outputScript target="#{pageJsTarget}">
    //<![CDATA[
    function displayConnectIframe() {
        var margin = 80;
        var min = 200;
        jQuery('#connectLoaderWaiter').css('display','none');
        var h = jQuery(document).height() - jQuery("#beforeIframe").position().top -margin;
        if (h<min) {
          h=min;
        }
        jQuery("#connectIframe").height(h);
        jQuery("#connectIframe").css("display","block");
    }
    //]]>
    </h:outputScript>

    <span id="beforeIframe"></span>
    <c:if test="#{connectServerReachable}">
      <c:if test="#{!adminViews.hasExternalPackageDownloadRequest()}">
        <iframe id="connectIframe"
          src="#{contextPath}/site/connectClient/packages/remote?type=addon&amp;onlyRemote=#{appsViews.onlyRemote}&amp;filterOnPlatform=#{appsViews.platformFilter}"
          frameborder="0" scrolling="auto" width="100%" style="display: none"
          onload="javascript:displayConnectIframe();"> </iframe>
      </c:if>
      <c:if test="#{adminViews.hasExternalPackageDownloadRequest()}">
        <iframe id="connectIframe"
          src="#{contextPath}/site/connectClient/download/start/#{adminViews.getExternalPackageDownloadRequest()}?source=remote"
          frameborder="0" scrolling="auto" width="100%" style="display: none"
          onload="javascript:displayConnectIframe();"> </iframe>
      </c:if>

      <div id="connectLoaderWaiter"
        style="width: 100%; height: 100px; text-align: center">
        <img src="#{contextPath}/img/big_loading.gif" />
      </div>

    </c:if>

    <c:if test="#{not connectServerReachable}">
      <div class="processMessage completeInfo">
        <h:outputText value="#{messages['adminsubtab.servernotreachable']}" />
      </div>
    </c:if>

  </a4j:outputPanel>

</h:panelGroup>